<eb-wizard-component wizard-title="{{ 'SQUID_BLOCKER.BLOCKED_WHITELISTED.TITLE' | translate }}">

    <eb-wizard-content>

        <!-- TARGET -->
        <div>
            <div layout="column" layout-align="center stretch"
                 layout-padding>
                <span translate="SQUID_BLOCKER.BLOCKED_WHITELISTED.TARGET"></span>
                <span style="font-weight: bold;word-break: break-all;word-wrap: break-word;">{{vm.truncateDomain(vm.target)}}</span>
            </div>
        </div>

        <!-- MESSAGE -->
        <div layout="column" layout-align="center stretch"
             layout-padding>
            <p>
                {{'SQUID_BLOCKER.BLOCKED_WHITELISTED.MESSAGE' | translate}}<br>
            </p>
        </div>

        <div layout="row" layout-sm="column" layout-align="end center">
            <md-button class="md-raised md-accent" ng-click="vm.back()" ng-disabled="!vm.isBackButtonAvailable">
                {{'SQUID_BLOCKER.BLOCKED_WHITELISTED.ACTION.BACK' | translate}}
            </md-button>
            <md-button class="md-raised" ng-click="vm.retry()">
                {{'SQUID_BLOCKER.BLOCKED_WHITELISTED.ACTION.RETRY' | translate}}
            </md-button>
        </div>

    </eb-wizard-content>
</eb-wizard-component>
